<template>
  <div class="set">
    <el-tabs v-model="activeName">
      <el-tab-pane label="认证费用" name="first">
        <div class="vip">
          <h2>诚信会员认证金额设置</h2>
          <el-table
            :data="tableData"
            border
            style="width: 50%">
            <el-table-column
              label="套餐"
              align="center">
              <template slot-scope="scope">
                <span>{{scope.row.type}}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="价格(元)"
              align="center">
              <template slot-scope="scope">
                <el-input v-model="scope.row.money" placeholder="请输入金额"></el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-tab-pane>
      <el-tab-pane label="广告费用" name="second">
        <div class="vip">
          <h2>广告推广金额设置</h2>
          <el-table
            :data="tableData2"
            border
            style="width: 50%">
            <el-table-column
              label="投放时间/位置"
              align="center">
              <template slot-scope="scope">
                <span>{{scope.row.type}}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="首页"
              align="center">
              <template slot-scope="scope">
                <el-input v-model="scope.row.indexMoney" placeholder="请输入金额"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="二级页面"
              align="center">
              <template slot-scope="scope">
                <el-input v-model="scope.row.secondMoney" placeholder="请输入金额"></el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>

      </el-tab-pane>
    </el-tabs>
    <div class="save">
      <el-button type="primary">保存</el-button>
    </div>

  </div>

</template>

<script>
    export default {
      data() {
        return {
          activeName: 'first',
          tableData:[
            {
              type:'诚信会员月费（1个月）',
              money:'',
            },
            {
              type:'诚信会员月费（1年）',
              money:'',
            },
            {
              type:'诚信会员月费（2年）',
              money:'',
            },
          ],
          tableData2:[
            {
              type:'1天',
              indexMoney:'',
              secondMoney:''
            },
            {
              type:'1个月',
              indexMoney:'',
              secondMoney:''
            },
            {
              type:'1年',
              indexMoney:'',
              secondMoney:''
            },
          ]
        };
      },
    }
</script>

<style scoped lang="scss">
  .set{
    width: 100%;
    .el-tabs{
      width: 100%;
      .vip{
        h2{
          margin: 40px;
          text-align: left;
          font-size: 25px;
        }
      }
    }
    .save{
      text-align: left;
      padding: 30px 0 0 40px;
      .el-button{
        margin-left: 20%;
      }
    }

  }

</style>
